import React, { Component } from 'react'
import {Route, Link, Redirect, Switch} from 'react-router-dom'
import {
 Layout, Menu
} from 'antd'
const { Content, Sider } = Layout
import List from '@/components/list'
import Detail from '@/components/detail'

export default class movie extends Component {
  render() {
    return (
      <div style={{ background: '#fff', flex: 1 }}>
        <Layout style={{ background: '#fff',height: '492px' }}>
          <Sider width={200} style={{ background: '#fff', height: '100%' }}>
            <Menu
              mode="inline"
              defaultSelectedKeys={[location.hash.split('/')[2] || 'in_theaters']}
              defaultOpenKeys={['sub1']}
              style={{ height: '100%', borderRight: 0 }}
            >
              <Menu.Item key="in_theaters"><Link to="/movie/in_theaters/1" replace>正在热映</Link></Menu.Item>
              <Menu.Item key="coming_soon"><Link to="/movie/coming_soon/1" replace>即将上映</Link></Menu.Item>
              <Menu.Item key="top250"><Link to="/movie/top250/1" replace>top250</Link></Menu.Item>
            </Menu>
          </Sider>
          <Content style={{ padding: '10px', minHeight: 280 }}>
            <Route exact path="/movie" render={()=><Redirect to="/movie/in_theaters/1"/>} />
            <Switch>
              <Route path="/movie/detail/:id" component={Detail}/>
              <Route path="/movie/:type/:page" component={List}/>
            </Switch>
          </Content>
        </Layout>
      </div>
    )
  }
}
